<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogShow"
    :width="width"
    :before-close="handleClose">
      <slot></slot>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="handleSave">确 定</el-button>
      </span>
  </el-dialog>
</template>

<script>
export default {
  name: 'HlDialog',
  props: {
    // 弹框的开关
    dialogShow: {
      type: Boolean,
      default: false
    },
    // 弹框的title
    title: {
      type: String,
      default: '提示'
    },
    // 宽度
    width: {
      type: String,
      default: '30%'
    }
  },
  methods: {
    // 关闭
    handleClose() {
      this.$emit('handleClose')
    },
    // 打开
    handleSave() {
      this.$emit('handleSave')
    }
  }
}
</script>

<style scoped>

</style>
